(function(){
	var list=document.getElementById("list");
	var prev=document.getElementById("prev");
	var next=document.getElementById("next");
	var buttons=document.getElementById("buttons").getElementsByTagName("span");
	function animation(offset){
		var newLeft= parseInt(list.style.left)+offset;
		if(newLeft<-3840){
			newLeft=-640;
		}else if(newLeft>-640){
			newLeft=-3200;
		}
		list.style.left=newLeft+"px";
		buttonsShow();
	}
	var index=1;
	function buttonsShow(){
		for(var i=0 ; i<buttons.length ; i++){
			if (buttons[i].className="on"){
				buttons[i].className="";
			}
		}
		buttons[index-1].className="on";
	}
	prev.onclick=function(){
		index--;
		if(index<1){
			index=5;
		};
		animation(640);
	}
	next.onclick=function(){
		index++;
		if(index>5){
			index=1;
		};
		animation(-640);
	}
	var Index;
	for(var i=0 ; i<buttons.length ; i++){
		buttons[i].onmouseover=function(){
			Index=parseInt(this.getAttribute('index'));
			var offset=640*(index-Index);
			index=Index;
			animation(offset);
		}
	};
	var timer;
	function play(){
		timer=setInterval(function(){
			next.onclick();
		},3000);
	}
	function stop(){
		clearInterval(timer);
	}
	var container=document.getElementById("container");
	container.onmouseover=stop;
	container.onmouseout=play;
})();
